import React, { Component } from 'react'
import { render } from 'react-dom'
import { Clock } from './components/app'

class App extends Component {
  constructor() {
    super()
    this.state = this.getTime()
  }

  getTime() {
    const now = new Date()
    return {
      hours: now.getHours(),
      minutes: now.getMinutes(),
      seconds: now.getSeconds(),
      tenths: parseInt(now.getMilliseconds() / 10),
    }
  }

  componentDidMount() {
    setInterval(() => {
      this.setState(this.getTime())
    }, 10)
  }

  render() {
    return (
      <div>
        <h1>App</h1>
        <Clock {...this.state} />
      </div>
    )
  }
}

render(<App />, document.getElementById('root'))